<template>
  <CloudTreeSelect
    v-model="value"
    :treeData="treeData"
    show-search
    style="width: 300px"
    :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
    placeholder="Please select"
    allow-clear
    tree-default-expand-all
  >
    <CloudIcon slot="suffixIcon" type="smile" />
  </CloudTreeSelect>
</template>

<script>
  export default {
    title: '3.后缀图标 ',
    subTitle: '最简单的用法。',
    data () {
      return {
        value: undefined,
        treeData: [{
          title: 123,
          key: 123,
          isParent: true,
          children: [{
            title: 456,
            key: 456
          }, {
            title: 789,
            key: 789
          }, {
            title: 111,
            key: 111
          }, {
            title: 222,
            key: 222
          }, {
            title: 333,
            key: 333
          }]
        }],
      }
    },
    methods: {
    }
  }
</script>
<style lang="scss" scoped>
</style>